 a {
     text-decoration: none;
     color: #fff;
 }

 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
 }

 body {
     font-family: Arial, sans-serif;
     background: url('./images/bg.png') no-repeat center center;
     background-size: cover;
     display: flex;
     justify-content: center;
     align-items: center;
     height: 100vh;
     color: #333;
 }

 .login-container {
     background: rgba(255, 255, 255, 0.9);
     padding: 20px;
     border-radius: 15px;
     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
     text-align: center;
     width: 300px;
 }

 .login-container img {
     width: 100px;
     margin-bottom: 20px;
 }

 .login-container .logo-text {
     font-size: 20px;
     font-weight: bold;
     margin-bottom: 10px;
     color: #333;
 }

 .login-container input[type="text"],
 .login-container input[type="password"] {
     width: 100%;
     padding: 10px;
     margin: 10px 0;
     border: 1px solid #ccc;
     border-radius: 20px;
     font-size: 14px;
 }

 .login-container button {
     width: 100%;
     padding: 10px;
     background-color: #333;
     color: #fff;
     border: none;
     border-radius: 20px;
     font-size: 16px;
     cursor: pointer;
     margin-top: 10px;
 }

 .login-container button:hover {
     background-color: #555;
 }

 .login-container .link {
     margin-top: 10px;
     font-size: 12px;
 }

 .login-container .link a {
     color: #007BFF;
     text-decoration: none;
 }

 .login-container .link a:hover {
     text-decoration: underline;
 }

 .login-container .get-code {
     display: inline-flex;
     justify-content: space-between;
     align-items: center;
 }

 .login-container .get-code input {
     width: calc(70% - 5px);
 }

 .login-container .get-code button {
     width: 30%;
     background-color: #333;
     color: #fff;
     border: none;
     border-radius: 20px;
     font-size: 12px;
     cursor: pointer;
 }

 .login-container .get-code button:hover {
     background-color: #555;
 }